<template>
    <div class="app-container">
        <div class="filter-container">
            <el-table border :data="tableData">
                <el-table-column label="用户名" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="终端客户名称" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="绑定手机" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="联系人" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="终端客户地址" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="审核操作人" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
            </el-table>
        </div>
        <div class="filter-container">
            <el-table border :data="dataInfo">
                <el-table-column label="资料名称" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="资料附件" prop="imgUrl" align="center">
                    <template slot-scope="{row}">
                        <img clickable title="资料附件" :src="row.imgUrl" style="max-width: 50px;max-height: 70px"/>
                    </template>
                </el-table-column>
                <el-table-column label="审核状态" prop="name" align="center" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="操作" prop="name" align="center" width="200">
                    <template slot-scope="{row,$index}">
                        <el-button type="primary" size="mini">合格</el-button>
                        <el-button type="danger" size="mini">不合格</el-button>
                    </template>
                </el-table-column>
                <el-table-column label="其他" prop="name" align="center" width="100">
                    <template slot-scope="{row,$index}">
                        <el-button type="primary" size="mini">下载</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="filter-container">
            <el-form :model="formData" size="small" label-width="80px">
                <el-form-item label="审核状态">
                    <el-select v-model="formData.status" placeholder="请选择">
                        <el-option
                            v-for="item in options2"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                            :disabled="item.disabled">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="客户id">
                    <el-input v-model="formData.status" disabled></el-input>
                </el-form-item>
                <el-form-item label="处理意见" class="rows">
                    <el-input
                        type="textarea"
                        :rows="4"
                        placeholder="请输入意见"
                        maxlength="200"
                        show-word-limit
                        resize="none"
                        v-model="formData.name">
                    </el-input>
                </el-form-item>
                <el-row>
                    <el-col :span="2" :offset="11">
                        <el-button type="primary" size="small">保存</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        name: "audit",
        data() {
            return {
                tableData:[{name: '大药房'}],
                dataInfo:[
                    {name: '大药房哈哈哈', imgUrl: require('@/assets/404_images/404.png')},
                    {name: '大药房哈哈', imgUrl: require('@/assets/img/collapseLogo.png')}
                ],
                formData: {
                    status:''
                },
                options2: [{
                    value: 1, label: '合格'
                },{
                    value: 2, label: '不合格'
                },{
                    value: 3, label: '通过'
                }]
            }
        }
    }
</script>

<style scoped>
    .filter-container{padding-bottom: 40px;}
</style>
